<template>
  <div>
        <el-table :show-header="false"
            highlight-current-row
            @current-change="handleCurrentChange"
            :data="data">
          <el-table-column label="名字" align="left" prop="name" />
        </el-table>
        <!-- <el-button type="primary" style="float: right; margin-bottom: 5px;" size="mini" plain>增加指标</el-button> -->
        <el-table :data="itemList" height="400" row-key="id" default-expand-all
        :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
          <el-table-column label="编号" align="left" prop="itemNo" width="120" />
          <el-table-column label="检查项目" align="left" prop="name" width="160"/>
          <el-table-column label="检查要点" align="left" prop="spec" />
        </el-table>
  </div>
</template>

<script>
import { listItem, delItem } from "@/api/labsafety/labsafetyCheckRefIndexItem";
export default {
  name: "TargetItem",
  props: {
    data: Array,
    instanceId: Number
  },
  data() {
    return {
      total: 0,
      currentRow: 0,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        indexId: null,
        instanceId: null
      },
      itemList: []
    };
  },
  created() {
  },
  methods: {
    handleCurrentChange(val) {
      this.currentRow = val;
      this.getList()
    },
    getList() {
	  if(!this.currentRow){
		  return;
	  }
      const indexId = this.currentRow.id
      listItem({indexId: indexId, instanceId: this.instanceId}).then(response => {
        this.itemList = this.handleTree(response.rows, "indexItemId");
        this.total = response.total
        this.queryParams.indexId = indexId
        this.queryParams.instanceId = this.instanceId
      })
    },
    handleDelete(row) {
      delItem(row.id).then(response => {
        this.getList()
      })
    }
  }
};
</script>

<style scoped>
/* 去掉中间数据的分割线 */
.el-table__row > td {
  border: none;
}
/* 去掉上面的线 */
/* .el-table th.is-leaf{
        border: none;
    } */
/* 去掉最下面的那一条线 */
.el-table::before {
  height: 0px;
}
</style>
